<template>
    <div class="page-controller">
      <el-tabs v-model="activeName" class="demo-tabs" @tab-change="handleClick">
        <el-tab-pane :label="item.name" :name="item.id" v-for="item,index in tabsArr" :key="index"></el-tab-pane>
      </el-tabs>
      <tagMaint v-if="activeName == '1'" :activeName="activeName"></tagMaint>
      <tagGroup v-if="activeName == '2'" :activeName="activeName" @get-list="getTagGroupList"></tagGroup>
    </div>
  </template>
  <script lang="ts" setup>
  import { reactive, onMounted, ref, computed, watch } from 'vue'
  import tagMaint from './components/tagMaint'
  import tagGroup from './components/tagGroup'
  import { useMessage, useMessageBox } from '@/hooks/message'
  import type { PageConfig, Column } from '@/types/components'
  import { useRoute } from 'vue-router'
  import { initSearchData } from '@/utils/common'
  import { getQueryTableCache } from '@/utils/cacheUtils'
  import { apiQueryTag,apiEnableTag,apiDisableTag,apiDeleteTag,apiQueryDtTaggroup } from '@/api/modules/GM.js'
  const route = useRoute()
  // 页面编码
  const tableId = 'assigneecfg'
  const state = reactive({
    query: {
        tagCode: '',
        tagName: '',
        groupCode: '',
        tagState: '',
        current: 1,
        size: 10,
    },
    dataList: [],
  })
  const pageConfig: PageConfig = reactive({
    total: 0,
    currentPage: 1,
  })
  const tabsArr = ref([
    {
      name:'标签管理',
      id:'1',
    },
    {
      name:'标签分组',
      id:'2',
    },
  ])
  const columns: Column[] = reactive([
  ])
  const isTableLoading = ref(false)
  const tagGroupList = ref([])
  const tagMaintList = ref([])
  const activeName = ref('1')
  const handleClick = (tab) =>{
    // pageConfig.currentPage = 1
    // state.query.current = 1
    // if(tab == '1'){
    //   searchFn()
    // }else{
    //   getTagGroupList('',1,10)
    // }
  }
  const getTagGroupList = (query,current,size) =>{
    pageConfig.currentPage = current
    pageConfig.pageSize = size
    let par = {
      current: current || 1,
      queryAll: false,
      groupCode: query.groupCode || '',
      groupName: query.groupName || '',
      size:size || 10
    }
    apiQueryDtTaggroup(par)
    .then((res) => {
      console.log(res, '小代码')
      if (res.data.success) {
        tagGroupList.value = res.data.data.result
        pageConfig.pageSize = Number(res.data.data.size)
        pageConfig.total = Number(res.data.data.count)
        
      }
    })
    .catch((error: any) => {})
  }
  const deleteApi = (tagId) =>{
    
    apiDeleteTag({ tagId })
      .then((res) => {
        
        if (res.data.success) {
          useMessage().success(res.data.message)
          searchFn()
        }
      })
      .catch((error: any) => {
        useMessage().error(error.data.message)
      })
  }
  const stopApi = (tagId) =>{
    apiDisableTag({ tagId })
      .then((res) => {
        
        if (res.data.success) {
          useMessage().success(res.data.message)
          searchFn()
        }
      })
      .catch((error: any) => {
        useMessage().error(error.data.message)
      })
  }
  const openApi = (tagId) =>{
    apiEnableTag({ tagId })
      .then((res) => {
        
        if (res.data.success) {
          useMessage().success(res.data.message)
          searchFn()
        }
      })
      .catch((error: any) => {
        useMessage().error(error.data.message)
      })
    
  } 
  const handleCurrentChange = (e) => {
    pageConfig.currentPage = e
    searchFn()
  }
  const searchFn = (type?: string, columnsVal?: any) => {
    
    const obj = initSearchData(type, columnsVal, columns, state.query)
    state.query = obj.queryData
    // columns.values = obj.columns
    console.log('执行')
    state.query.current = pageConfig.currentPage
    isTableLoading.value = true
    if (pageConfig.pageSize) state.query.size = pageConfig.pageSize
    apiQueryTag(state.query)
      .then((res) => {
        console.log(res, 'res')
        isTableLoading.value = false
        if (res.data.success) {
          state.dataList = res.data.data.result
          // console.log(state.dataList)
          pageConfig.pageSize = Number(res.data.data.size)
          pageConfig.total = Number(res.data.data.count)
        } else {
          // ElMessage.error(res.data.message)
        }
      })
      .catch((error: any) => {
        isTableLoading.value = false
        // 处理错误
      })
  }
  // const handleSave = () => {
  //   isTableLoading.value = true
  //   saveSuccessful.value = false
  //   apiSaveAssignee(checkedRows.value)
  //     .then((res) => {
  //       isTableLoading.value = false
  //       if (res.data.success) {
  //         // saveSuccessful.value = true
  //         tableRef.value.clearSelection()
  //         searchFn()
  //       } else {
  //         ElMessage.error(res.data.message)
  //       }
  //     })
  //     .catch((error: any) => {
  //       isTableLoading.value = false
  //     })
  // }
  //   const exportRow = () => {
  //     apiGroupUserExport(state.query)
  //   }
  const ruleFormRef = ref(null)
  
  onMounted(() => {
    // 获取查询条件缓存
    // const { cachedQuery, cachedColumns } = getQueryTableCache(route.path, tableId, state.query, columns.values)
    // if (cachedQuery) state.query = cachedQuery
    // if (columns) columns.values = cachedColumns
    // searchFn()
  })
  </script>
  <style lang="less" scoped></style>
  